<%--
  Created by IntelliJ IDEA.
  User: asd73
  Date: 2017/9/23
  Time: 15:07
  To change this template use File | Settings | File Templates.
--%>
<%--百度风云榜--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <style>
        .con ul ul{display: none;}
        .con ul .current ul{ display: block}
    </style>
    <script type="text/javascript" src="../js/jquery.js"></script>
    <script type="text/javascript">
        $(function () {
            $('.con .btn').click(function (e) {
                //方法1
/*                if ($(this).parent().hasClass('current')){
                    $(this).parent().removeClass('current');//如果父级类名有特殊名，则进行删除类名
                }else {
                    $(this).parent().addClass('current').siblings().removeClass('current');
                }*/
                //方法2
                $(this).parent().toggleClass('current').siblings().removeClass('current');
            });
        })
    </script>
</head>
<body>
    <div class="con">
        <ul >
            <li >
                <a href="javascript:;" class="btn">事件</a>
                <ul>
                    <li><a href="javascript:;"></a>最近</li>
                    <li><a href="javascript:;"></a>上周</li>
                    <li><a href="javascript:;"></a>上月</li>
                </ul>
            </li>
        </ul>
        <ul >
            <li >
                <a href="javascript:;" class="btn">娱乐</a>
                <ul>
                    <li><a href="javascript:;"></a>游戏</li>
                    <li><a href="javascript:;"></a>电影</li>
                    <li><a href="javascript:;"></a>电视</li>
                </ul>
            </li>
        </ul>
        <ul >
            <li >
                <a href="javascript:;" class="btn">人物</a>
                <ul>
                    <li><a href="javascript:;"></a>游戏</li>
                    <li><a href="javascript:;"></a>电影</li>
                    <li><a href="javascript:;"></a>电视</li>
                </ul>
            </li>
        </ul>
    </div>
</body>
</html>
